package com.client.elements.canvas;

import java.util.ArrayList;
import java.util.Arrays;

import com.google.gwt.canvas.client.Canvas;
import com.google.gwt.canvas.dom.client.Context2d;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.event.dom.client.MouseDownEvent;
import com.google.gwt.event.dom.client.MouseDownHandler;
import com.google.gwt.event.dom.client.MouseMoveEvent;
import com.google.gwt.event.dom.client.MouseMoveHandler;
import com.google.gwt.event.dom.client.MouseOutEvent;
import com.google.gwt.event.dom.client.MouseOutHandler;
import com.google.gwt.event.dom.client.MouseUpEvent;
import com.google.gwt.event.dom.client.MouseUpHandler;
import com.google.gwt.user.client.Timer;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.FlexTable;
import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RadioButton;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.VerticalPanel;
import com.google.gwt.user.client.ui.Widget;

public class Malen {
	static Canvas canvas_main;

	static Context2d context_main;

	static int mouseX = 170;
	static int mouseY = 170;

	static int groesse = 40;
	static Boolean clicked = false;

	static String color = "black";

	static FlexTable tbl_farben = new FlexTable();
	static FlexTable tbl_rest = new FlexTable();
	static FlowPanel main = new FlowPanel();
	static Button btn_clear = new Button("Clear");
	static RadioButton rdb_Kreis = new RadioButton("Auswahl", "Kreis");;
	static RadioButton rdb_Quadrat = new RadioButton("Auswahl", "Quadrat");
	static TextBox txt_groesse = new TextBox();

	public static Widget vierecke() {
		rdb_Kreis.setValue(true);
		txt_groesse.setText(Integer.toString(groesse));
		txt_groesse.setWidth("20px");

		canvas_main = Canvas.createIfSupported();
		canvas_main.setCoordinateSpaceWidth(400);
		canvas_main.setCoordinateSpaceHeight(400);
		canvas_main.addStyleName("border");

		context_main = canvas_main.getContext2d();

		timer(false);
		setHandlers();

		ArrayList<String> farben = new ArrayList<String>(Arrays.asList(new String[]{"white","yellow","red","green","blue","black",}));

		for (int i = 0; i < farben.size(); i++) {
			Label lbl = new Label();
			Label lbl_Text = new Label();
			lbl.setSize("20px", "20px");
			lbl.getElement().setId(farben.get(i));
			lbl.addStyleName(farben.get(i));
			lbl.addDomHandler(farben_labels_clickhandler, ClickEvent.getType());

			lbl_Text.setSize("40px", "20px");
			lbl_Text.setText(farben.get(i));

			tbl_farben.setWidget(0, i, lbl);
			tbl_farben.setWidget(1, i, lbl_Text);
		}

		tbl_rest.setWidget(0,0,rdb_Kreis);
		tbl_rest.setWidget(0,1,rdb_Quadrat);
		tbl_rest.setWidget(0,8,new HTML("Grösse:"));
		tbl_rest.setWidget(0,9,txt_groesse);
		tbl_rest.setWidget(0,20,btn_clear);

		VerticalPanel v = new VerticalPanel();
		v.add(canvas_main);
		v.add(tbl_farben);
		v.add(tbl_rest);
		return v;
	}

	final static Timer timer = new Timer() {
		@Override
		public void run() {
			if (clicked) {
				try {
					groesse = Integer.parseInt(txt_groesse.getText()) / 2;
				} catch (NumberFormatException e) {
					Window.alert("ungültiger Wert!");
					txt_groesse.setText(Integer.toString(groesse));
				}

				context_main.beginPath();
				context_main.setFillStyle(color);
				if (rdb_Kreis.getValue()) {
					int radius = groesse/2;
					context_main.arc(mouseX + radius, mouseY + radius, radius, 0, Math.PI * 2, true);
				}else if (rdb_Quadrat.getValue()) {
					context_main.fillRect(mouseX, mouseY, groesse, groesse);
				}
				context_main.closePath();
				context_main.fill();
			}
		}};

		private static void timer(boolean stop) {
			if (stop == false) {
				timer.scheduleRepeating(10);		
			}else {
				timer.cancel();
			}
		}

		private static void setHandlers() {
			canvas_main.addMouseMoveHandler(new MouseMoveHandler() {
				public void onMouseMove(MouseMoveEvent event) {
					mouseX = event.getRelativeX(canvas_main.getElement()) - groesse / 2;
					mouseY = event.getRelativeY(canvas_main.getElement()) - groesse / 2;
				}
			});

			canvas_main.addMouseDownHandler(new MouseDownHandler() {
				@Override
				public void onMouseDown(MouseDownEvent event) {
					clicked = true;
				}
			});

			canvas_main.addMouseUpHandler(new MouseUpHandler() {
				@Override
				public void onMouseUp(MouseUpEvent event) {
					clicked = false;
				}
			});

			canvas_main.addMouseOutHandler(new MouseOutHandler() {
				@Override
				public void onMouseOut(MouseOutEvent event) {
					clicked = false;
				}
			});
			btn_clear.addClickHandler(new ClickHandler() {
				@Override
				public void onClick(ClickEvent event) {
					context_main.clearRect(0, 0, 400, 400);
				}
			});
		}

		static ClickHandler farben_labels_clickhandler = new ClickHandler() {
			@Override
			public void onClick(ClickEvent event) {
				color = event.getRelativeElement().getId();
			}
		};
}